<template>
  <c-back-wrap :loading="loading" go-page="经销商门店新建管理" current-page="详情">
    <c-title title="经销商-客户基本信息">
      <CustomerBaseInfoView :detail="detail" />
    </c-title>
    <c-title title="经销商-新增门店基本信息">
      <QupList :column="3" sep="：" default-value="" label-position="right" label-width="150">
        <QupListItem label="门店编码" :value="shopDTO.code" />
        <QupListItem label="门店名称" :value="shopDTO.name" />
        <QupListItem label="门店经营业务类型" :value="shopDTO.businessTypeName" />
        <QupListItem label="门店类型" :value="shopDTO.shopClassifyName" />
        <QupListItem label="国别" :value="shopDTO.countryName" />
        <QupListItem label="省份" :value="shopDTO.provinceName" />
        <QupListItem label="城市" :value="shopDTO.cityName" />
        <QupListItem label="区/县" :value="shopDTO.countyName" />
        <QupListItem label="街道/乡镇" :value="shopDTO.townName" />
        <QupListItem label="详细地址" :value="shopDTO.shopAddr" :span="24" />
        <QupListItem label="所在楼层" :value="shopDTO.floor" />
        <QupListItem label="城市级别" :value="shopDTO.cityLevelName" />
        <QupListItem label="市场层级" :value="shopDTO.marketLevelName" />
        <QupListItem label="门店咨询电话" :value="shopDTO.shopInfoPhone" />
        <QupListItem label="售后电话" :value="shopDTO.shopServPhone" />
        <QupListItem label="出图总面积(㎡)" :value="`${shopDTO.outpicArea || 0}㎡`" />
        <QupListItem label="是否装修门头" :value="shopDTO.isDecorationDoorHead" dict-type-code="BOOLEANS" :prop-enum="{domainCode:'marketing',appCode:'slm'}" />
        <!-- <QupListItem label="门头面积(㎡)" :value="`${shopDTO.doorHeadArea || 0}㎡`" /> -->
        <QupListItem label="是否缴纳保证金" :value="detail.isDeposit" dict-type-code="BOOLEANS" :prop-enum="{domainCode:'marketing',appCode:'slm'}" />
        <QupListItem v-if="[1, '1'].includes(detail.isDeposit)" label="保证金缴纳日期" :value="$trimHMS(detail.depositDate)" />
        <QupListItem label="成品保证金金额(元)" :value="`${detail.finishedDeposit || 0}`" />
        <QupListItem label="定制保证金金额(元)" :value="`${detail.customizedDeposit || 0}`" />
        <QupListItem label="橱柜保证金金额(元)" :value="`${detail.cupboardDeposit || 0}`" />
        <QupListItem label="卫浴保证金金额(元)" :value="`${detail.bathroomDeposit || 0}`" />
        <QupListItem label="营业执照图片" :span="24">
          <c-file-list :uploadable="false" :editable="false" :model-id="shopDTO.id" view-type="list" type-code="ACCESS060" />
        </QupListItem>
        <QupListItem label="专卖店特许经营合同图片" :span="24">
          <c-file-list :uploadable="false" :editable="false" :model-id="shopDTO.id" view-type="list" type-code="ACCESS061" />
        </QupListItem>
        <QupListItem label="成品面积(㎡)" :value="`${shopDTO.endProductArea || 0}㎡`" />
        <QupListItem label="全屋定制面积(㎡)" :value="`${shopDTO.fullHouseArea || 0}㎡`" />
        <QupListItem label="整体橱柜面积(㎡)" :value="`${shopDTO.cabinetArea || 0}㎡`" />
        <QupListItem label="卫浴面积(㎡)" :value="`${shopDTO.bathroomArea || 0}㎡`" />
        <QupListItem label="样板间面积(㎡)" :value="`${shopDTO.modelRoomArea || 0}㎡`" />
        <QupListItem label="窗帘面积(㎡)" :value="`${shopDTO.curtainArea || 0}㎡`" />
        <QupListItem label="橱柜套数" :value="shopDTO.cabinetSuite" />
        <QupListItem label="卫浴套数" :value="shopDTO.bathroomSuite" />
        <QupListItem label="单店总面积(㎡)" :value="`${shopDTO.totalArea || 0}㎡`" />
        <QupListItem label="门头类型" :value="shopDTO.headTypeName" />
        <QupListItem label="门头面积(㎡)" :value="`${shopDTO.doorHeadArea || 0}㎡`" />
        <QupListItem label="门楣面积(㎡)" :value="`${shopDTO.lintelArea || 0}㎡`" />
        <QupListItem label="是否新增客户业务类型" :value="detail.isChangeBusinessType" dict-type-code="BOOLEANS" :prop-enum="{domainCode:'marketing',appCode:'slm'}" />
        <QupListItem label="调整后客户业务类型" :value="shopDTO.afterBusinessTypeName" />
        <QupListItem label="是否新增业务账号" :value="detail.isChangeAccount" dict-type-code="BOOLEANS" :prop-enum="{domainCode:'marketing',appCode:'slm'}" />
        <QupListItem label="账号编码" :value="detail.accountCode" />
        <QupListItem label="账号名称" :value="detail.accountName" />
        <QupListItem label="账号类型" :value="detail.accountTypeName" />
      </QupList>
    </c-title>
    <c-title title="经销商-门店联系人">
      <ContactsTable title="经销商-门店联系人" :table-data="detail.contactDTOS || []" />
    </c-title>
    <c-title title="经销商-门店报图信息">
      <QupList :column="3" sep="：" default-value="" label-position="right" label-width="130">
        <QupListItem label="是否报图" :value="shopDTO.isReportPic" dict-type-code="BOOLEANS" :prop-enum="{domainCode:'marketing',appCode:'slm'}" />
        <QupListItem v-if="![1,'1'].includes(shopDTO.isReportPic)" label="特殊建档附件" :span="24">
          <c-file-list :uploadable="false" :editable="false" :model-id="shopDTO.id" view-type="list" type-code="ACCESS062" />
        </QupListItem>
      </QupList>
    </c-title>
    <c-title title="经销商-门店收货地址信息">
      <AddrTable title="经销商-门店收货地址信息" :table-data="(detail.addressDTOS || []).filter(e=>[1,'1'].includes(e.isBefore))" type="view" />
      <div class="el-form-item el-form-item--mini" style="padding-top: 10px;display:flex;align-items:center;">
        <span class="el-form-item__label">是否新增收货地址</span>
        <span>{{ isNewAddress?'是':'否' }}</span>
      </div>
      <AddrTable v-if="isNewAddress" title="经销商-新增收货地址" :table-data="(detail.addressDTOS || []).filter(e=>![1,'1'].includes(e.isBefore))" />
    </c-title>
    <c-title title="经销商-门店交接信息">
      <QupList :column="1" sep="：" default-value="" label-position="right" label-width="140">
        <QupListItem label="是否属于交接门店" :value="detail.isMarketConnect" dict-type-code="BOOLEANS" :prop-enum="{domainCode:'marketing',appCode:'slm'}" />
        <template v-if="[1,'1'].includes(detail.isMarketConnect)">
          <QupListItem label-width="0px">
            <DistributionTable title="经销商-门店交接信息" :table-data="detail.handoverDTOS || []" />
          </QupListItem>
          <QupListItem label="交接证明" :span="24">
            <c-file-list :uploadable="false" :editable="false" :model-id="id" view-type="list" type-code="ACCESS063" />
          </QupListItem>
          <QupListItem label="经销商关系证明" :span="24">
            <c-file-list :uploadable="false" :editable="false" :model-id="id" view-type="list" type-code="ACCESS064" />
          </QupListItem>
          <QupListItem label="交接双方现场签订照片" label-width="160px" :span="24">
            <c-file-list :uploadable="false" :editable="false" :model-id="id" view-type="list" type-code="ACCESS111" />
          </QupListItem>
        </template>
      </QupList>
    </c-title>
    <c-title title="BPM审核信息">
      <QupList :column="3" sep="：" default-value="" label-position="right" label-width="150">
        <QupListItem :value="detail.createBy" label="申请人" />
        <QupListItem :value="detail.createTime" label="申请时间" />
        <QupListItem :value="detail.applyNo" label="BPM单号" />
        <QupListItem label="客户经理门店新建提报原始表单" label-width="200px" :span="24">
          <c-file-list :uploadable="false" :editable="false" :model-id="id" view-type="list" type-code="ACCESS081" />
        </QupListItem>
        <!-- <QupListItem label="办事处审批结果" :value="detail.officeReviewResult" dict-type-code="REVIEW_RESULT" :prop-enum="{domainCode:'marketing',appCode:'slm'}" /> -->
        <!-- <QupListItem :value="detail.officeReviewTime" label="办事处审批结束时间" /> -->
        <!-- <QupListItem :value="detail.officeReviewAdvice" label="办事处审批意见" :span="24" /> -->
        <!-- <QupListItem :value="detail.officeAccountingReviewAdvice" label="办事处会计处理意见" :span="24" /> -->
        <!-- <QupListItem label="档案科审核结果" :value="detail.fileReviewResult" dict-type-code="REVIEW_RESULT" :prop-enum="{domainCode:'marketing',appCode:'slm'}" /> -->
        <!-- <QupListItem :value="detail.fileReviewTime" label="档案科审核时间" /> -->
        <!-- <QupListItem :value="detail.fileReviewAdvice" label="档案科审核意见" :span="24" /> -->
        <!-- <QupListItem :value="detail.authorityReviewTime" label="系统权限处理审核时间" /> -->
        <!-- <QupListItem :value="detail.authorityReviewAdvice" label="系统权限处理审核意见" :span="24" /> -->
      </QupList>
      <Options :data="detail.opinionDTOS" />
    </c-title>
    <div class="btn-center">
      <c-button type="primary" @click="handleGoBack">返回</c-button>
    </div>
  </c-back-wrap>
</template>
<script>
import { shopDetail } from '@/api/channelTask2/newShop'
import AddrTable from '../../components/AddrTable'
import ContactsTable from '../../components/ContactsTable'
import DistributionTable from '../../components/DistributionTable'
import CustomerBaseInfoView from '../../components/CustomerBaseInfoView'
import Options from '../../components/Options'

export default {
  name: 'Detail',
  components: {
    AddrTable,
    ContactsTable,
    DistributionTable,
    CustomerBaseInfoView,
    Options
  },
  props: {
    id: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      detail: {},
      loading: false
    }
  },
  computed: {
    shopDTO() {
      return this.detail.shopDTO || {}
    },
    isNewAddress() {
      return (this.detail.addressDTOS || []).some(e => ![1, '1'].includes(e.isBefore))
    }
  },
  created() {
    this.getDetailData()
  },
  methods: {
    getDetailData() {
      this.loading = true
      return shopDetail(this.id).then(res => {
        this.detail = res.data
      }).finally(() => {
        this.loading = false
      })
    },
    handleGoBack() {
      this.$pageStack.pop()
    }
  }
}
</script>
